<template>
  <div class="wrapper">

      <keep-alive><v-menus></v-menus></keep-alive>
      <keep-alive>
          <div class="contioner">
            <transition name="move" mode="out-in">
             <router-view></router-view>
            </transition>
          </div>
      </keep-alive>


  </div>
</template>





<script>

  import vMenus from './menus.vue'

  export default {

    components:{vMenus},

    methods: {
      
    }
  }
</script>



<style scoped>

  .wrapper{
    overflow: scroll;
    overflow-x: hidden;
    width: 100%;
    height: 100%;
    padding:20px 10px;
    box-sizing: border-box;
    background: #fff;
    display:flex;
    /* box-shadow: 0 17px 10px 10px rgba(0,0,0,.2) inset; */
  }
  .contioner{
    float: left;
    /* margin-left:20px; */
    padding:20px;
    flex: 1;
    min-height: 100%;
    box-shadow: 0px 0px 20px 0 rgba(0,0,0,.1) inset;
    overflow: auto;

    /* border:1px solid #000 */
  }
   .el-menu-item.is-active{
    border-right: 2px solid #409EFF;
    transition: all .1s;
  }


</style>